<template>
	<view class="about">
		<view class="u-p-50">
			<u-parse :html="config.about"></u-parse>
		</view>

		<u-cell-group :border="false">
			<u-cell-item :border-bottom="false" :arrow="false" :title="config.name">
				<image class="icon" slot="icon" src="../../static/pingtai.png"></image>
			</u-cell-item>
			<u-cell-item :border-bottom="false" :title="config.phone" @click="call">
				<image class="icon" slot="icon" src="../../static/hezuo.png"></image>
			</u-cell-item>
			<u-cell-item :border-bottom="false" @click="openMap" :title="config.address">
				<image class="icon" slot="icon" src="../../static/ditu.png"></image>
			</u-cell-item>
		</u-cell-group>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				config: []
			}
		},
		onLoad() {
			this.getPageData();
		},
		methods: {
			async getPageData(cb) {
				let res = await this.$u.api.getPageData({
					page: "userAbout"
				});
				this.config = res.data;
				typeof cb == 'function' && cb();
			},
			openMap: function() {
				uni.openLocation({
					name: this.config.name,
					address: this.config.address,
					latitude: parseFloat(this.config.lat),
					longitude: parseFloat(this.config.lng),
					success: function() {
						console.log('success');
					}
				});
			},
			call: function() {
				uni.makePhoneCall({
					phoneNumber: this.config.phone
				});
			}

		}
	};
</script>

<style>
	.icon {
		width: 50rpx;
		height: 50rpx;
		;
		margin-right: 50rpx;
	}

	.u-cell {
		padding-left: 50rpx;
		padding-right: 50rpx;
	}
</style>